<!<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>财务报销流程</title>
    <link rel="stylesheet" type="text/css" media="screen" href="css/mui.css" />
    <link rel="stylesheet" type="text/css" media="screen" href="css/main.css" />
    <script type="text/javascript" src="js/flexible.js"></script>
    <script type="text/javascript" src="js/mui.js"></script>
    <script type="text/javascript" src="js/jquery.js"></script>
</head>
<body>
<div class="back-header">
    <div class="header-img"><i class="mui-icon mui-icon-arrowleft"></i></div>
    <div class="header-txt">个人报销流程</div>
    <div class="header-right-txt"><i class="mui-icon mui-icon-location" style="margin-top:.2rem;"></i></div>
</div>
<div class="z-content">
    <div class="one-row"><b>上报人：某某某</b></div>
    <div class="info-img">
        <div class="img-box"><img src="./image/timg.jpg" /></div>
        <div class="img-box"><img src="./image/timg.jpg" /></div>
        <div class="img-box"><img src="./image/timg.jpg" /></div>
        <div class="img-box"><img src="./image/timg.jpg" /></div>
    </div>
    <div class="more-info">
        <div class="info-top">
            <div class="info-left">
                <span>报销金额：</span>
                <span>报销时间：</span>
                <span>报销内容：</span>
            </div>
            <div class="info-right">
                <span>100</span>
                <span>2018年7月27日 22:12:51</span>
                <span>测试测试测试测试测试测试测试测试测试测试</span>
            </div>
        </div>
        <div class="info-bottom">审批中　等待：某某某　审批　2018年7月27日</div>
    </div>
    <div class="time-line">
        <div class="time-part">
        <div class="left-line"><i></i></div>
        <div class="right-text">
            <div class="tl-row">
                <span>上报</span>
                <span>2018年7月27日 22:50:32</span>
            </div>
            <div class="tl-row">
                <span>谢超 上报</span>
                <span>谢超</span>
            </div>
        </div>
        </div>
        <div class="time-part">
        <div class="left-line"><i></i></div>
        <div class="right-text">
            <div class="tl-row">
                <span>上报</span>
                <span>2018年7月27日 22:50:32</span>
            </div>
            <div class="tl-row">
                <span>谢超 上报</span>
                <span>谢超</span>
            </div>
        </div>
        </div>
    </div>
</div>
<div class="mask"></div>
<div class="img-content"><img src="./image/timg.jpg" /></div>
<script>
    $('.img-box').click(function(){
        $('.mask').show();
        $('.img-content').addClass('normalImg').find('img').attr('src',$('img',this).attr('src'))
    });
    $('.mask').click(function(){
        $(this).hide();
        $('.img-content').removeClass('normalImg')
    })
</script>
</body>
</html>